<template>
  <!-- 催收执行页-历史信息模块-出入库记录 -->
  <section class="component outgoing-warehousing-history">
    <!-- 搜索区域 -->
    <data-form :model="searchModel" @onSearch="refreshData" ref="form">
      <template slot="inputs">
        <el-form-item label="申请时间：" prop="createTime">
          <el-date-picker v-model="searchModel.createTime" type="datetimerange">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="申请类型：" prop="warehouseChangeType">
          <el-select placeholder="请选择" v-model="searchModel.warehouseChangeType" clearable>
            <el-option v-for="item in $dict.getDictData('WarehouseChangeType')" :key="item.code" :label="item.name" :value="item.code"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="申请人：" prop="operatorRealName">
          <el-input v-model="searchModel.operatorRealName" clearable></el-input>
        </el-form-item>
        <el-form-item label="审核结果：" prop="carApplyStatus">
          <el-select placeholder="请选择" v-model="searchModel.carApplyStatus" clearable>
            <el-option v-for="item in $dict.getDictData('CarApplyStatus')" :key="item.code" :label="item.name" :value="item.code"></el-option>
          </el-select>
        </el-form-item>
      </template>
    </data-form>
    <!-- 数据列区域 -->
    <data-box @onPageChange="refreshData" :data="dataSet" :page="pageService" :height="200">
      <template slot="columns">
        <el-table-column label="申请时间" :min-width="$helper.getColumnWidth(5)">
          <template slot-scope="scope">
            <span>{{scope.row.createTime | dateTimeFormat}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="warehouseChangeType" label="申请类型" :min-width="$helper.getColumnWidth(3)" :formatter="(row) => $filter.dictConvert(row.warehouseChangeType,'WarehouseChangeType')">
        </el-table-column>
        <el-table-column prop="operatorRealName" label="申请人" :min-width="$helper.getColumnWidth(5)">
        </el-table-column>
        <el-table-column prop="approvedRealName" label="审核人" :min-width="$helper.getColumnWidth(5)">
        </el-table-column>
        <el-table-column prop="carApplyStatus" label="审核结果" :min-width="$helper.getColumnWidth(3)" :formatter="(row) => $filter.dictConvert(row.carApplyStatus,'CarApplyStatus')">
        </el-table-column>
        <el-table-column label="审核时间" :min-width="$helper.getColumnWidth(5)">
          <template slot-scope="scope">
            <span>{{scope.row.approvedTime | dateTimeFormat}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="remark" label="备注" :min-width="$helper.getColumnWidth(10)">
        </el-table-column>
      </template>
    </data-box>
  </section>
</template>

<script lang="ts">
import Vue from 'vue';
import Component from 'vue-class-component';
import { Dependencies } from '~/core/decorator';
import { Prop } from "vue-property-decorator";
import { CaseOperatorPageService } from '~/services/domain-service/case-operator-page.service';
import { PageService } from '~/utils/page.service';
import { SortService } from '~/utils/sort.service';
import { CASE_CHANNEL } from "~/config/enum.config";
import { namespace } from "vuex-class";
const CollectionExecutionModule = namespace("collection-execution");

@Component({
  components: {


  },
})
export default class OutgoingWarehousingHistory extends Vue {
  @Dependencies(PageService)
  private pageService: PageService;
  @Dependencies(SortService)
  private sortService: SortService;
  @Dependencies(CaseOperatorPageService)
  private caseOperatorPageService: CaseOperatorPageService;
  @CollectionExecutionModule.State private caseId;

  private searchModel: any = {
    createTime: [],
    operatorRealName: '',
    warehouseChangeType: '',
    caseId: ''
  };
  private dataSet: any[] = [];

  //获取电催行动历史
  private refreshData() {
    const params = { ...this.searchModel }
    params.caseId = this.caseId
    params.createTimeMax = this.$filter.dateRanageFormat(this.searchModel.createTime).end
    params.createTimeMin = this.$filter.dateRanageFormat(this.searchModel.createTime).start
    delete params.createTime

    this.caseOperatorPageService
      .queryWarehouseChangeRecords(params, this.pageService)
      .subscribe((data) => {
        this.dataSet = data;
      });
  }

  private activated() {
    this.refreshData()
  }
}
</script>

<style lang="less" scoped>
</style>
